import 'package:flutter/material.dart';
import 'item/home_item_page.dart';

class MainHomePage extends StatefulWidget {
  @override
  _MainHomePageState createState() => _MainHomePageState();
}

class _MainHomePageState extends State<MainHomePage>
    with SingleTickerProviderStateMixin {
  List<String> topTabList = [
    "推荐",
    "动态",
    "Java",
    "程序人生",
    "移动开发",
    "数据算法",
    "程序感言"
  ];
  List<Widget> bodyPageList = [];
  TabController tabController;
  @override
  void initState() {
    super.initState();
    tabController = new TabController(length: topTabList.length, vsync: this);
    for (int i = 0; i < topTabList.length; i++) {
      bodyPageList.add(new HomeItemPage(i, topTabList[i]));
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: NestedScrollView(
        headerSliverBuilder: (BuildContext context, bool b) {
          return [
            SliverAppBar(
              // 设置SliverAppBar 是否固定
              pinned: true,
              // 是否随着滑动来隐藏标题
              floating: true,
              actions: [
                IconButton(
                    icon: Icon(Icons.add_circle_rounded),
                    onPressed: () {
                      print("点击了按钮");
                    }),
              ],
              // 之所以使用material 由于下面的ink 包裹的inkwell没有水波纹效果
              title: Material(
                color: Colors.grey[300],
                borderRadius: BorderRadius.all(Radius.circular(6)),
                child: Ink(
                  // decoration: BoxDecoration(
                  //   color: Colors.grey[400],
                  //    borderRadius: BorderRadius.all(Radius.circular(6)),
                  // ),
                  child: InkWell(
                    onTap: () {
                      print("点击了inkwell");
                    },
                    splashColor: Colors.blue,
                    borderRadius: BorderRadius.all(Radius.circular(6)),
                    child: Container(
                      // 不给container宽度 container的宽度随父widget
                      height: 33,
                      child: Row(
                        children: [
                          SizedBox(width: 10),
                          Icon(Icons.search, size: 18),
                          SizedBox(width: 10),
                          Text("搜索",
                              style:
                                  TextStyle(color: Colors.white, fontSize: 15)),
                        ],
                      ),
                    ),
                  ),
                ),
              ),
              bottom: TabBar(
                // 是否可滑动
                isScrollable: true,
                controller: tabController,
                tabs: topTabList
                    .map((String tabTitle) => Tab(text: tabTitle))
                    .toList(),
              ),
            )
          ];
        },
        body: TabBarView(
          controller: tabController,
          children: bodyPageList,
        ),
      ),
    );
  }
}
